 export  const Texts =`
 import React, { useEffect } from 'react'
 import { UseThree } from '@/components'
 import { message } from 'antd'
 type Props = {}
 function ThreeDom(props: Props) {
   let useThree: UseThree
   useEffect(() => {
     useThree = new UseThree('canvas')
     // useThree 里面的所有参数和方法都可以通过 useThree.xx拿到
     useThree.renderers.setClearColor('#4A758D')//改变背景色
     getGltf()
     getFbx()
     onmodelclick()
     useThree.getother()//其他一些参数 自行添加经常用的方法自己定义
 
   }, [])
   // 点击模型
   function onmodelclick() {
     useThree.onmodelclick((e) => {
       if (!e) return
       console.log(e); //返回值点击模型的位置
       message.success('你点击了' + e.object.name + ',位置是x：' + e.point.x + 'y：' + e.point.y + 'z：' + e.point.z);
     })
 
   }
   // 导入fbx
   async function getFbx(){
    const gltf = await useThree.getFbx(require('../../../assets/fbx/d.fbx'))
    gltf.position.set(-250, 0, -0)
  
   }
   // 导入gltf模型
   async function getGltf() {
     const gltf = await useThree.getGlb(require('../../../assets/glb/LittlestTokyo.glb'))
     // 改变大小
     gltf.scene.position.set(-0, 100, -0)
     let scale = .5
     gltf.scene.scale.set(scale, scale, scale)
   }
   return (
       <div id='canvas' style={{ width: '100%', height: '100%' }}>
       </div>
   )
 }
 export default ThreeDom
    `